<!DOCTYPE html>
<html lang="en"><head>
  	<title>Miscellanous</title>
  	<meta charset="utf-8">
    <meta name="description" content="Your description">
    <meta name="keywords" content="Your keywords">
    <meta name="author" content="Your name">
	<link rel="stylesheet" href="css/style.css">
    <script src="js/jquery-1.7.1.min.js"></script>
    <script src="js/script.js"></script>
<!--[if lt IE 8]>
   <div style=' clear: both; text-align:center; position: relative;'>
     <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
       <img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
    </a>
  </div>
<![endif]-->
<!--[if lt IE 9]>
	<script src="js/html5.js"></script>
	<link rel="stylesheet" href="css/ie.css"> 
<![endif]-->
</head>
<body id="propage">
<!-- PRO Framework Panel Begin -->
<div id="advanced"><span class="trigger"><strong></strong><em></em></span><div class="bg_pro"><div class="pro_main"><span class="pro_logo"></span><ul class="pro_menu"><li><a href="index.html"><img src="images/pro_images/pro_home.png" alt=""></a></li><li><a href="404.html">Pages<span></span></a><ul>	<li><a href="under_construction.html">Under Construction</a></li><li><a href="intro.html">Intro Page</a></li><li><a href="404.html">404 page</a></li></ul></li><li><a href="layouts.html">Layouts</a></li><li><a href="typography.html">Typography</a></li><li><a href="portfolio.html">Gallery Layouts<span></span></a><ul><li><a href="portfolio.html">Portfolio</a></li><li><span></span><a href="just-slider.html">Sliders</a><ul><li><a href="just-slider.html">Just Slider</a></li><li><a href="kwicks.html">Kwicks Slider</a></li><li><a href="functional-slider.html">Functional Slider</a></li></ul></li><li><a href="gallery-page1.html">Gallery</a></li></ul></li><li class="current"><a href="misc.html">Extras<span></span></a><ul><li><a href="social_media.html">Social and Media<br> Sharing</a></li><li><a href="css3.html">CSS3 Tricks</a></li><li class="current"><a href="misc.html">Misc</a></li></ul></li></ul><div class="pro_clear"></div></div></div><div class="bg_pro2"></div></div>
<!-- PRO Framework Panel End -->
<!-- Header -->
<header>
    <div class="main">
        <h1><a href="index.html">Prospect</a></h1>
        <span class="phone">Call Toll-Free:  <span>1-800-559-65-80</span></span>
        <nav>
            <ul class="sf-menu">
                <li><a href="index.html">About us</a><ul>
                        <li><a href="more.html">Who We Are</a></li>
                        <li><a href="more.html">Our Mission</a></li>
                    </ul>
                </li>
                <li><a href="index-1.html">Services</a></li>
                <li><a href="index-2.html">Solutions</a></li>
                <li><a href="index-3.html">Support</a></li>
                <li><a href="index-4.html">partners</a></li>
                <li><a href="index-5.html">Contacts</a></li>
            </ul>
        </nav>
        <div class="clear"></div>
    </div>
</header>
<!-- Content -->
<section id="content">
	<div class=" container_24">
		<div class="pro_wrapper"><div class="grid_24"><h2 class="pro_title3">Miscellanous</h2></div></div>
		<div class="">
			<div class="grid_24">
<!-- Carousel Begin -->
				<h3 class="pro_title3">Carousel</h3>
                <div class="pro_car-wrapper">
                    <div class="pro_carousel">
                        <ul>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_1.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_2.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_3.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_4.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_5.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_6.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_7.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_8.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_1.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_2.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_3.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_4.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_5.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_6.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_7.jpg" alt=""></span></li>
                            <li><span class="pro_image_style3"><img src="images/stock_images/200x150_8.jpg" alt=""></span></li>
                        </ul>
                        <div class="pro_clear"></div>
                    </div>
                    <a href="#" class="pro_btn pro_prev pro_car-button" data-type="prevPage"><span></span></a>
                    <a href="#" class="pro_btn pro_next pro_car-button" data-type="nextPage"><span></span></a>
                </div>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make carousel work  <strong>uCarausel.js </strong>file is used</p>
						<p>Add the following code to your html page and in the &quot;src&quot; image attribute define path to the image files. </p>
						<p>To add more images to the carousel duplicate the following code: <strong>&lt;li&gt;&lt;img src="YourImage.jpg" alt=""&gt;&lt;/li&gt;</strong>, don't forget to define path to images in the &quot;src&quot; attribute.</p>
<pre class="pro_htmlCode">&lt;div class="pro_car-wrapper"&gt;
	&lt;div class="pro_carousel"&gt;
		&lt;ul&gt;
			&lt;li&gt;&lt;img src="YourImage.jpg" alt=""&gt;&lt;/li&gt; &lt;!-- Your Image --&gt;
			...
		&lt;/ul&gt;
	&lt;/div&gt;
	&lt;a href="#" class="pro_btn pro_prev pro_car-button" data-type="prevPage"&gt;&lt;span&gt;&lt;/span&gt;&lt;/a&gt;&lt;!--Previous Page Button--&gt;
	&lt;a href="#" class="pro_btn pro_next pro_car-button" data-type="nextPage"&gt;&lt;span&gt;&lt;/span&gt;&lt;/a&gt;&lt;!--Next Page Button--&gt;
&lt;/div&gt;</pre>
						</div>
					</dd>
				</dl>
<!-- Carousel End -->
			</div>
			<div class="pro_clear"></div>
			<div class="pro_wrapper">
				<div class="grid_12">
<!-- Accordion Begin -->
				<h3 class="pro_title">Accordion</h3>
				<dl id="pro_accordion"> 
               		<dt><a href="#"><span></span>Automation</a></dt> 
                    <dd> 
                        <div class="pro_indent"> 
							<ul class="pro_list1"> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
							</ul> 
                        </div> 
                    </dd>
               		<dt><a href="#"><span></span>Automation</a></dt> 
                    <dd> 
                        <div class="pro_indent"> 
							<ul class="pro_list1"> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
							</ul> 
                        </div> 
                    </dd>
               		<dt><a href="#"><span></span>Automation</a></dt> 
                    <dd> 
                        <div class="pro_indent"> 
							<ul class="pro_list1"> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
								<li><a href="#">Accelerators</a></li> 
							</ul> 
                        </div> 
                    </dd>
                </dl>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make accordion work  <strong>jquery-ui-1.8.17.custom.min.js</strong> file is issued</p>
						<p>To add according to the page use the following code:</p>
<pre class="pro_htmlCode">&lt;dl id="pro_accordion"&gt;
	&lt;dt&gt;&lt;a href="#"&gt;&lt;span&gt;&lt;/span&gt;
		Heading 
	&lt;/a&gt;&lt;/dt&gt; 
	&lt;dd&gt; Content &lt;/dd&gt;
	....
&lt;/dl&gt;</pre>
						</div>
					</dd>
				</dl>
<!-- Accordion End -->
				</div>
				<div class="grid_12">
<!-- SlideDown Begin -->
				<h3 class="pro_title">SlideDown</h3>
				<div class="pro_slide-down-pad">
					<dl class="pro_slide-down-box">
						<dt><span></span>SlideDown Button</dt>
						<dd>
							<div class="pro_inner">
								Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							</div>
						</dd>
					</dl>
				</div>
				<div class="pro_slide-down-pad">
					<dl class="pro_slide-down-box absol">
						<dt><span></span>SlideDown Absolute Button</dt>
						<dd>
							<div class="pro_inner">
								Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
							</div>
						</dd>
					</dl>
				</div>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>Here you will simply need to add <strong>pro_slide-down-box</strong> class to any dl-list (&lt;dl class="pro_slide-down-box"&gt;).</p>
<pre class="pro_htmlCode">&lt;dl class="pro_slide-down-box"&gt;
	&lt;dt&gt; Heading &lt;/dt&gt; 
	&lt;dd&gt; Content &lt;/dd&gt;
&lt;/dl&gt;</pre>
						<p>Add <strong>pro_slide-down-box</strong> and <strong>absol</strong> classes to any dl-list (&lt;dl class="pro_slide-down-box absol"&gt;).</p>
<pre class="pro_htmlCode">&lt;dl class="pro_slide-down-box absol"&gt;
	&lt;dt&gt; Heading &lt;/dt&gt; 
	&lt;dd&gt; Content &lt;/dd&gt;
&lt;/dl&gt;</pre>
						</div>
					</dd>
				</dl>
<!-- SlideDown End -->
				</div>
			</div>
			<div class="pro_wrapper">
				<div class="grid_24">
<!-- Tabs Begin -->
				<h3 class="title">Tabs</h3>
				<div class="pro_wrapper">
					<div class="grid_12 alpha">
						<div class="pro_tabs-horz-top">
							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
<div class="pro_tab-content">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
						</div>
					</div>
					<div class="grid_12 omega">
						<div class="pro_tabs-horz-top2">
							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
							<div class="pro_clear"></div>
<div class="pro_tab-content">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
						</div>
					</div>
				</div>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make the pro_tabs work <strong>jquery.tools.min.js </strong>file is used</p>
						<p>Using the following code you can create a pro_tabs with the menu in the top left corner:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-horz-top"&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
&lt;/div&gt;</pre>
						<p>Using the following code you can create a pro_tabs with the menu in the top right corner:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-horz-top2"&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
&lt;/div&gt;</pre>
						</div>
					</dd>
				</dl>
				<div class="pro_wrapper pro_tabs-pad">
					<div class="grid_12 alpha">
						<div class="pro_tabs-horz-bottom">
<div class="pro_tab-content">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
						</div>
					</div>
					<div class="grid_12 omega">
						<div class="pro_tabs-horz-bottom2">
<div class="pro_tab-content">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>
<div class="pro_tab-content">
	Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna.
</div>

							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
						</div>
					</div>
				</div>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make the pro_tabs work <strong>jquery.tools.min.js </strong>file is used</p>
						<p>Using the following code you can create a pro_tabs with the menu in the bottom left corner:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-horz-bottom"&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
&lt;/div&gt;</pre>
						<p>Using the following code you can create a pro_tabs with the menu in the bottom right corner:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-horz-bottom2"&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
&lt;/div&gt;</pre>
						</div>
					</dd>
				</dl>
				<div class="pro_wrapper pro_tabs-pad">
					<div class="grid_12 alpha">
						<div class="pro_tabs-vert-left">
							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
							<div class="pro_tab-content-box">
								<div class="pro_tab-content">
									Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
								<div class="pro_tab-content">
									Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
								<div class="pro_tab-content">
									Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
							</div>
						</div>
					</div>
					<div class="grid_12 omega">
						<div class="pro_tabs-vert-right">
							<ul class="pro_tabs-nav">
								<li><a href="#">Tab 1</a></li>
								<li><a href="#">Tab 2</a></li>
								<li><a href="#">Tab 3</a></li>
							</ul>
							<div class="pro_tab-content-box">
								<div class="pro_tab-content">
									Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Morbi feugiat pharetra turpis, sed posuere nisi porta a. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
								<div class="pro_tab-content">
									Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
								<div class="pro_tab-content">
									Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Maecenas tristique orci ac sem. Duis ultricies pharetra magna. Donec accumsan malesuada orci. Quisque nulla. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh.
								</div>
							</div>
						</div>
					</div>
				</div>
				<dl class="pro_description-box pro_description-box-pad3">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make the pro_tabs work <strong>jquery.tools.min.js </strong>file is used</p>
						<p>Using the following code you can create a pro_tabs with the left menu:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-vert-left"&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
&lt;/div&gt;</pre>
						<p>Using the following code you can create a pro_tabs with the right menu:</p>
<pre class="pro_htmlCode">&lt;div class="pro_tabs-vert-right"&gt;
	&lt;ul class="pro_tabs-nav"&gt;
		&lt;li>&lt;a href="#"&gt;Tab 1&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 2&lt;/a>&lt;/li&gt;
		&lt;li>&lt;a href="#"&gt;Tab 3&lt;/a>&lt;/li&gt;
	&lt;/ul>
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
	&lt;div class="pro_tab-content"&gt; Tab content &lt;/div&gt;
&lt;/div&gt;</pre>
						</div>
					</dd>
				</dl>
<!-- Tabs End -->
				</div>
			</div>
			<div class="pro_wrapper">
				<div class="grid_8">
<!-- Tooltips Begin -->
				<h3 class="pro_title">Tooltips</h3>
				<div class="pro_tooltips-pad">
					<span><strong><a href="#" class="pro_btn normaltip" title="Your Text">Default Tooltip</a></strong><code class="pro_small-box-code">class="normaltip" title="Text"</code></span>
					<span><strong><a href="#" class="pro_btn fixedtip" title="Your Text">Fixed Tooltip</a></strong><code class="pro_small-box-code">class="fixedtip" title="Text"</code></span>
					<span><strong><a href="#" class="pro_exampletip clicktip">On Click Tooltip</a></strong><code class="pro_small-box-code">class="clicktip" title="Text"</code></span>
				</div>
<!-- Tooltips End -->
				</div>
				<div class="grid_8">
<!-- Testimonials Begin -->
				<div class="pro_wrapper">
					<h3 class="pro_title">Testimonials</h3>
					<div id="pro_testimonials">
						<div class="">
							<div class="pro_quotes_2">
								<blockquote>“Lorem ipsum dolor amet consectetu adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris...”</blockquote>
								<span></span>
							</div>
							<div class="pro_quotes-links"><a href="#">Mark Johnson</a><br>
							President and CEO, R&amp;D Services</div>
						</div>
						<div class="">
							<div class="pro_quotes_2">
								<blockquote>“Cras ultricies, quam ac lobortis porta, ante sapien mollis dui. Etiam vel enim lorem. Etiam vel enim lorem. Nunc lorem sapien....”</blockquote>
								<span></span>
							</div>
							<div class="pro_quotes-links"><a href="#">Mark Johnson</a><br>
							President and CEO, R&amp;D Services</div>
						</div>
						<div class="">
							<div class="pro_quotes_2">
								<blockquote>“Etiam vel enim lorem. Nunc lorem sapien, ultrices at faucibus at, varius a est. Cras ultricies, quam ac lobortis porta, ante sapien mollis dui...”</blockquote>
								<span></span>
							</div>
							<div class="pro_quotes-links"><a href="#">Mark Johnson</a><br>
							President and CEO, R&amp;D Services</div>
						</div>
					</div>
					<div class="pro_testim_buttons">
						<a href="#" id="pro_prev_testim"><span></span></a>
						<a href="#" id="pro_next_testim"><span></span></a>
					</div>
				</div>
<!-- Testimonials End -->
				</div>
				<div class="grid_8">
<!-- Dialog Begin -->
					<h3 class="pro_title">Dialog window</h3>
					<div class="pro_dialog-pad">
						<div id="pro_dialog" title="Basic dialog">
							<p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
							<div>To add dialog box to your page add the following button code to the HTML document (button will display the dialog box on click):</div>
							<pre class="pro_htmlCode2">&lt;button id="pro_opener" class="pro_exampletip"&gt;Open Dialog&lt;/button&gt;</pre>
							<div>Then add content to the dialog window. It doesn't matter where you put the code as it won't be visible until you click the button</div>
							<pre class="pro_htmlCode2">&lt;div id="pro_dialog" title="Heading"&gt;
	Content of Dialog
&lt;/div&gt;</pre>
							<div>If you want to add multiple dialog boxes to the page you only need to add new ID to the dialog box and add new initialization script to the  script.js</div>
							<pre class="pro_jsCode2">$.fx.speeds._default = 1000;
$(function() {
	$( "#NEWdialog" ).dialog({
		autoOpen: false,
		show: "fade",
		hide: "fade"
	});

	$( "#NEWopener" ).click(function() {
		$( "#NEWdialog" ).dialog( "open" );
		return false;
	});
});</pre>
						</div>
						<button id="pro_opener" class="pro_exampletip">Open Basic Dialog</button>
					</div>
					<div class="pro_dialog-pad">
						<div id="pro_dialog2" title="Modal dialog">
							<p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
							<div>To add dialog box to your page add the following button code to the HTML document (button will display the dialog box on click):</div>
							<pre class="pro_htmlCode2">&lt;button id="pro_opener2" class="pro_exampletip"&gt;Open Dialog&lt;/button&gt;</pre>
							<div>Then add content to the dialog window. It doesn't matter where you put the code as it won't be visible until you click the button</div>
							<pre class="pro_htmlCode2">&lt;div id="pro_dialog2" title="Heading"&gt;
	Content of Dialog
&lt;/div&gt;</pre>
							<div>If you want to add multiple dialog boxes to the page you only need to add new ID to the dialog box and add new initialization script to the  script.js</div>
							<pre class="jsCode2">$.fx.speeds._default = 1000;
$(function() {
	$( "#NEWdialog2" ).dialog({
		autoOpen: false,
		show: "fade",
		hide: "fade",
		modal:true
	});

	$( "#NEWopener2" ).click(function() {
		$( "#NEWdialog2" ).dialog( "open" );
		return false;
	});
});</pre>
						</div>
						<button id="pro_opener2" class="pro_exampletip">Open Modal Dialog</button>
					</div>
					<div class="pro_dialog-pad">
						<div id="pro_dialog3" title="Log In">
							<form id="pro_log_in2">
								 <label><input type="text" value="Login" onFocus="if(this.value=='Login'){this.value=''}" onBlur="if(this.value==''){this.value='Login'}"></label>
								<label> <input type="password" value="Password" onFocus="if(this.value=='Password'){this.value=''}" onBlur="if(this.value==''){this.value='Password'}"></label>
								<div class="pro_buttons"><a class="pro_btn" onClick="document.getElementById('pro_log_in2').submit()">Log In</a></div>
							</form>
						</div>
						<button id="pro_opener3" class="pro_exampletip">Open Dialog with Log In form</button>
					</div>
<!-- dialog End -->
				</div>
			</div>
		</div>
		<div class="pro_wrapper">
			<div class="grid_16 prefix_8">
				
					<dl class="pro_description-box">
					<dt><a class="pro_description-dark">Description<span></span></a></dt>
					<dd>
						<div class="pro_inner">
						<p>To make Testimonials SlideShow work <strong>jquery.cycle.all.min.js</strong> file is used</p>
						<p>The Testimonials SlideShow HTML structure:</p>
<pre class="pro_htmlCode">&lt;div id="pro_testimonials"&gt;
	&lt;div&gt;
		Slide Box Content
	&lt;/div&gt;
	&lt;div&gt;
		Slide Box Content
	&lt;/div&gt;
	....
&lt;/div&gt;
&lt;div class="pro_testim_buttons"&gt;
	&lt;a href="#" id="pro_prev_testim"&gt;&lt;span&gt;&lt;/span&gt;&lt;/a&gt;
	&lt;a href="#" id="pro_next_testim"&gt;&lt;span&gt;&lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;</pre>
						<p class="pro_descr_pad2">Into the <strong>&lt;div&gt;</strong>Slide Box Content<strong>&lt;/div&gt;</strong> you can add any content either text or images. The amount of such content divs is unlimited.</p>
						<p>In the  <strong>&lt;div class="pro_testim_buttons"&gt;</strong> block you can see buttons that are used to navigate slides.</p>
						</div>
					</dd>
				</dl>
			</div>
		</div>
	</div>
</section>
<aside>
    <div class="container_24">
        <div class="wrapper">
            <article class="grid_12">
                <h6>Quick Links</h6>
                <div class="wrapper">
                    <article class="grid_4 alpha">
                        <ul>
                            <li><a href="more.html">About Us</a></li>
                            <li><a href="more.html">Testimonials</a></li>
                            <li><a href="more.html">Our Staff</a></li>
                            <li><a href="more.html">Events &amp; Press</a></li>
                            <li><a href="more.html">Contact Us</a></li>
                        </ul>
                    </article>
                    <article class="grid_4">
                        <ul>
                            <li><a href="more.html">Solutions &amp; Training</a></li>
                            <li><a href="more.html">Affiliate Program</a></li>
                            <li><a href="more.html">Production</a></li>
                            <li><a href="more.html">Risk Management</a></li>
                            <li><a href="more.html">Consultation</a></li>
                        </ul>
                    </article>
                    <article class="grid_4 omega">
                        <ul>
                            <li><a href="more.html">Sign Up</a></li>
                            <li><a href="more.html">Forums</a></li>
                            <li><a href="more.html">Affiliate Program</a></li>
                            <li><a href="more.html">FAQ</a></li>
                        </ul>
                    </article>
                </div>
            </article>
            <article class="grid_11 prefix_1">
                <h6>Contact Information</h6>
                <div class="wrapper">
                    <img class="img-indent-r" src="images/map.png" alt="">
                    <div class="extra-wrap">
                        <p>8901 Marmora Road Glasgow, D04 89GR</p>
                        Phone: +1 800 559 6580<br>
                        E-mail: mail@demolink.org<br>
                        <!--==============================footer=================================-->
                        <footer>
                            &copy; 2012 &nbsp; &nbsp;|&nbsp; &nbsp; <a href="index-6.html">Privacy Policy</a><br>
                        </footer>
                    </div>
                </div>
            </article>
        </div>
    </div>
</aside>
</body>
</html>